From fbf24d1bd070280299e30db87d8f92aef9e5bb69 Mon Sep 17 00:00:00 2001 From: Daniel Boles Date: Fri, 6 Oct 2017 02:32:37 +0100 Subject: [PATCH] HC: Add border/hilight when hovering flat buttons The border and icon highlight are useful feedback that was defeated by CSS precedence. It worked for .titlebuttons due to their implementation, but the same was not true for custom .flat buttons. This makes it so. https://bugzilla.gnome.org/show_bug.cgi?id=788580 --- gtk/theme/HighContrast/_common.scss | 3 ++- gtk/theme/HighContrast/gtk-contained-inverse.css | 2 +- gtk/theme/HighContrast/gtk-contained.css | 2 +- 3 files changed, 4 insertions(+), 3 deletions(-) diff --git a/gtk/theme/HighContrast/_common.scss b/gtk/theme/HighContrast/_common.scss index a1ed2c805a..e21a20a82a 100644 --- a/gtk/theme/HighContrast/_common.scss +++ b/gtk/theme/HighContrast/_common.scss @@ -409,7 +409,8 @@ button { } } - &:hover { + &:hover, + &.flat:hover { @include button(hover); -gtk-icon-filter: brightness(1.2); } diff --git a/gtk/theme/HighContrast/gtk-contained-inverse.css b/gtk/theme/HighContrast/gtk-contained-inverse.css index ddafbf95a5..d1a3a4e36a 100644 --- a/gtk/theme/HighContrast/gtk-contained-inverse.css +++ b/gtk/theme/HighContrast/gtk-contained-inverse.css @@ -178,7 +178,7 @@ button.sidebar-button:hover:active, button.titlebutton:hover:active, button.flat button.sidebar-button:backdrop, button.titlebutton:backdrop, button.sidebar-button:disabled, button.titlebutton:disabled, button.sidebar-button:backdrop:disabled, button.titlebutton:backdrop:disabled, button.flat:backdrop, button.flat:disabled, button.flat:backdrop:disabled { border-width: 2px; border-style: solid; color: gray; background-color: transparent; background-image: none; border-color: transparent; } -button.titlebutton:hover, button:hover { border-width: 2px; border-style: solid; color: #fff; background-color: #000; border-color: gray; background-image: none; -gtk-icon-filter: brightness(1.2); } +button.titlebutton:hover, button.sidebar-button:hover, button.titlebutton:hover, button:hover, button.flat:hover { border-width: 2px; border-style: solid; color: #fff; background-color: #000; border-color: gray; background-image: none; -gtk-icon-filter: brightness(1.2); } button.titlebutton:active, button.titlebutton:checked, button:active, button:checked { border-width: 2px; border-style: solid; background-image: none; color: black; background-color: white; border-color: gray; transition-duration: 50ms; } diff --git a/gtk/theme/HighContrast/gtk-contained.css b/gtk/theme/HighContrast/gtk-contained.css index 4991ca921b..fae7eec365 100644 --- a/gtk/theme/HighContrast/gtk-contained.css +++ b/gtk/theme/HighContrast/gtk-contained.css @@ -178,7 +178,7 @@ button.sidebar-button:hover:active, button.titlebutton:hover:active, button.flat button.sidebar-button:backdrop, button.titlebutton:backdrop, button.sidebar-button:disabled, button.titlebutton:disabled, button.sidebar-button:backdrop:disabled, button.titlebutton:backdrop:disabled, button.flat:backdrop, button.flat:disabled, button.flat:backdrop:disabled { border-width: 2px; border-style: solid; color: gray; background-color: transparent; background-image: none; border-color: transparent; } -button.titlebutton:hover, button:hover { border-width: 2px; border-style: solid; color: #000; background-color: #fff; border-color: gray; background-image: none; -gtk-icon-filter: brightness(1.2); } +button.titlebutton:hover, button.sidebar-button:hover, button.titlebutton:hover, button:hover, button.flat:hover { border-width: 2px; border-style: solid; color: #000; background-color: #fff; border-color: gray; background-image: none; -gtk-icon-filter: brightness(1.2); } button.titlebutton:active, button.titlebutton:checked, button:active, button:checked { border-width: 2px; border-style: solid; background-image: none; color: white; background-color: black; border-color: gray; transition-duration: 50ms; } -- 2.30.2